<template>
	<view class="item t-flex between useAnimate"  @click="emit('click')">
		<uv-image :src="$str.img(data.image)" mode="aspectFill" width="200rpx" height="160rpx" radius="10rpx"></uv-image>
		<view class="right t-flex colum between">
			<view class="f32 c3 bold nowrap">
				{{data.name}}
			</view>
			
			<view class="actions t-flex between nowrap">
				<view class="bold">
					<text class="prc">￥{{data.price}}</text>
					<text class="mprc ml20">￥{{data.marketprice}}</text>
				</view>
				<view class="btn t-flex center cf " v-if="btn">预约</view>
			</view>
		</view>
	</view>
</template>

<script setup lang="ts">
	
	const emit = defineEmits(['click'])
	
	defineProps({
		data:{
			type:Object,
			default:{}
		},
		btn:{
			type:Boolean,
			default:true
		}
	})
	
	
	
</script>

<style scoped lang="scss">
	.item{
		margin-bottom: 40rpx;
		.right{
			width: calc(100% - 230rpx);
			align-items: flex-start;
			height: 160rpx;
			.prc{
				color: #FF1616;
			}
			.mprc{
				color: #bbb;
				text-decoration: line-through;
			}
			.btn{
				width: 128rpx;
				height: 60rpx;
				background: $main-color;
				border-radius: 30rpx;
			}
		}
	}

</style>